var ECharts;
$(document).ready(function () {
    require.config({
        baseUrl: ctx+'/resource/plugins/echarts4',
        paths: {
            echarts: 'echarts',
            dark:'theme/dark',
        }
    });
    require(
        [
            'echarts',
            'dark'

        ],
        function (ec) {
            ECharts=ec;
            top_center_echart = ECharts.init(document.getElementById('top_center_echart'), 'dark');//巡检发起方式
            queryInspectSponsorWay();

            top_right_echart = ECharts.init(document.getElementById('top_right_echart'), 'dark');//当日巡检
            queryInspectTaskTimeDis();

            top_right1_echart= ECharts.init(document.getElementById('top_right1_echart'), 'dark');//巡检任务执行情况
            queryInspectTaskExecuteStatus();

            top_left_echart= ECharts.init(document.getElementById('top_left_echart'), 'dark');//30天系统健康度
            querySystemThirtyDayHealth();
            /*center_echart=ec.init(document.getElementById('center_echart'), 'dark');//30天覆盖趋势
            queryThirtyDayCoverTrend();*/
            down_right_echart=ECharts.init(document.getElementById('down_right_echart'), 'dark');//任务分组成功率
            queryInspectOverviews();

            setTimeout(function (){
                window.onresize = function () {
                   top_center_echart.resize();
                    top_right_echart.resize();
                    top_left_echart.resize();
                    /*center_echart.resize();*/
                    down_right_echart.resize();
                }
            },200)
        }
    );
    queryInspectTask();
    taskGroupPollingOverview();
    queryTaskGroupHealth();//动态生成表格中图形
});


/**资源总览*/
function queryInspectTask(){
    url=ctx+"/InspectReport/queryInspectTask";
    $.ajax({
        url:url,
        type:"post",
        success:function(data){
            var overview =JSON.parse(data);
            overview=overview.list;
            var tableStr="";
            if(overview.length>0){
                for(var i=0;i<overview.length;i++){
                    tableStr += "<tr><td title='"+overview[i].DESCRIBE+"'><span>" + overview[i].DESCRIBE + "</span></td>";
                    tableStr += "<td><span>" + overview[i].COUNT + "</span></td></tr>";
                }
            }
            $("#info").append(tableStr);
        },error:function(textStatus){
            console.log("error:"+textStatus.status);
        }
    });

}

function queryInspectSponsorWay(){
    url=ctx+"/InspectReport/queryInspectSponsorWay";
    $.ajax({
        url:url,
        type:"post",
        success:function(data){
            var overview =JSON.parse(data);
            var xdata=[];
            var ydata1=[];
            overview=overview.list;
            for(var i=0;i<overview.length;i++){

                xdata.push(overview[i].DESCRIBE);
                ydata1.push({value:overview[i].COUNT,name:overview[i].DESCRIBE});
            }

            option = {
                backgroundColor: '#fff',//背景色
                /*title : {
                    text: '巡检发起方式',
                    x:'center',
                    textStyle: {
                        color: '#AAAAAA'
                    }
                },*/
                tooltip : {
                    trigger: 'item',
                    formatter: "{a} <br/>{b} : {c} ({d}%)"
                },
                legend: {
                    orient: 'vertical',
                    left: 'right',
                    textStyle: {
                        color: '#AAAAAA'
                    },
                    data: xdata
                },
                series : [
                    {
                        name: '巡检发起方式',
                        type: 'pie',
                        avoidLabelOverlap: false,
                        silent:false,
                        hoverAnimation: true,
                        radius : ['40%','70%'],
                        center: ['50%', '55%'],
                        data:ydata1,
                        label: {
                            normal: {
                                show: false,
                                position: 'center',
                                formatter:'{b}\n\n{c}\n\n{d}%',
                                textStyle:{
                                    fontSize: '40',
                                    color: '#00736c'
                                }

                            },
                            emphasis: {
                                show: true,
                                textStyle: {
                                    fontSize: '15',
                                    fontWeight: 'bold'
                                }
                            }
                        },
                        labelLine: {
                            normal: {
                                show: false
                            }
                        }
                    }
                ]
            };

            top_center_echart.setOption(option);
        },error:function(textStatus){
            console.log("error:"+textStatus.status);
        }
    });


}
function queryInspectTaskTimeDis(){
    url=ctx+"/InspectReport/queryInspectTaskTimeDis";
    $.ajax({
        url:url,
        type:"post",
        success:function(data){
            var overview =JSON.parse(data);
            var xdata=[];
            var ydata1=[];
            overview=overview.list;
            console.log(overview);
            for(var i=0;i<overview.length;i++){

                xdata.push(overview[i].HOUR);
                ydata1.push(overview[i].COUNT);
            }
            console.log(xdata);
            console.log(ydata1);
            option = {
                backgroundColor: '#fff',
                /*title: {
                    text: '巡检任务时间分布',
                    textStyle: {
                        color: '#AAAAAA'
                    }

                },*/
                grid: {
                    top: 100
                },
                angleAxis: {
                    axisLine:{
                        lineStyle:{
                            color:'#CD950C',
                            width:4
                        }
                    },
                    axisTick:{
                        lineStyle:{
                            width: 3,
                            interval:0
                        }
                    },
                    axisLabel:{
                        fontSize: 14,
                        color:'#CD950C',
                        interval:0
                    },
                    type: 'category',
                    data: xdata
                },
                tooltip: {
                    show: true
                    /*formatter: function (params) {
                        var id = params.dataIndex;
                        return cities[id] + '<br>最低：' + data[id][0] + '<br>最高：' + data[id][1] + '<br>平均：' + data[id][2];
                    }*/
                },
                radiusAxis: {
                    axisLine:{
                        lineStyle:{
                            color:'#CD950C',
                            width:4
                        }
                    },
                    axisTick:{
                        lineStyle:{
                            width: 3
                        }
                    },
                    axisLabel:{
                        fontSize: 14,
                        color:'#EE2C2C'
                    },
                    inverse: true
                    /*max:30*/
                },
                polar: {
                },
                series: [{
                    barCategoryGap: 0,
                    type: 'bar',
                    // itemStyle: {
                    //     normal: {
                    //         color: 'transparent'
                    //     }
                    // },
                    data: ydata1,
                    coordinateSystem: 'polar'
                    // stack: '最大最小值',
                    // silent: true
                }
                ]
            };

            top_right_echart.setOption(option);
        },error:function(textStatus){
            console.log("error:"+textStatus.status);
        }
    });

}

function queryInspectTaskExecuteStatus(){

    url=ctx+"/InspectReport/queryInspectTaskExecuteStatus";
    $.ajax({
        url:url,
        type:"post",
        success:function(data){
            var overview =JSON.parse(data);
            var xdata=[];
            var ydata1=[];
            overview=overview.list;
            for(var i=0;i<overview.length;i++){

                xdata.push(overview[i].DESCRIBE);
                ydata1.push({value:overview[i].COUNT,name:overview[i].DESCRIBE});
            }

            option = {
                backgroundColor: '#fff',//背景色
                /*title : {
                    text: '巡检任务执行情况',
                    x:'center',
                    textStyle: {
                        color: '#AAAAAA'
                    }
                },*/
                tooltip : {
                    trigger: 'item',
                    formatter: "{a} <br/>{b} : {c} ({d}%)"
                },
                legend: {
                    orient: 'vertical',
                    left: 'right',
                    textStyle: {
                        color: '#AAAAAA'
                    },
                    data: xdata
                },
                series : [
                    {
                        name: '巡检任务执行情况',
                        type: 'pie',
                        avoidLabelOverlap: false,
                        silent:false,
                        hoverAnimation: true,
                        radius : ['40%','70%'],
                        center: ['50%', '55%'],
                        data:ydata1,
                        label: {
                            normal: {
                                show: false,
                                position: 'center',
                                formatter:'{b}\n\n{c}\n\n{d}%',
                                textStyle:{
                                    fontSize: '40',
                                    color: '#00736c'
                                }

                            },
                            emphasis: {
                                show: true,
                                textStyle: {
                                    fontSize: '15',
                                    fontWeight: 'bold'
                                }
                            }
                        },
                        labelLine: {
                            normal: {
                                show: false
                            }
                        }
                    }
                ]
            };

            top_right1_echart.setOption(option);
        },error:function(textStatus){
            console.log("error:"+textStatus.status);
        }
    });

}
function querySystemThirtyDayHealth(){

    url=ctx+"/InspectReport/querySystemThirtyDayHealth";
    $.ajax({
        url:url,
        type:"post",
        success:function(data){
            var overview =JSON.parse(data);
            var xdata=[];
            var ydata1=[];
            overview=overview.list;
            for(var i=0;i<overview.length;i++){

                xdata.push(overview[i].DAYS);
                ydata1.push(overview[i].HEALTH);
            }

            option = {
                backgroundColor: '#fff',//背景色
                /*title: {
                    text: '系统30天健康度',
                    textStyle: {
                        color: '#AAAAAA'
                    }
                },*/
                tooltip : {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'cross',
                        label: {
                            backgroundColor: '#6a7985'
                        }
                    }
                },
                grid: {
                    top:'10%',
                    left: '3%',
                    right: '4%',
                    bottom: '4%',
                    containLabel: true
                },
                xAxis : [
                    {
                        type : 'category',
                        boundaryGap : false,
                        axisLabel: {
                            show: true,
                            interval:1,
                            rotate:-30,
                            textStyle: {
                                color: '#AAAAAA'
                            }
                        },
                        data : xdata
                    }
                ],
                yAxis : [
                    {
                        type : 'value',
                        axisLabel: {
                            textStyle: {
                                color: '#AAAAAA'
                            }
                        }
                    }
                ],
                series : [
                    {
                        name:'健康度',
                        type:'line',
                        /*stack: '总量',*/
                        /*areaStyle: {normal: {}},*/
                        data:ydata1
                    }
                ]
            };

            top_left_echart.setOption(option);
        },error:function(textStatus){
            console.log("error:"+textStatus.status);
        }
    });
}

function queryThirtyDayCoverTrend(){
    url=ctx+"/InspectReport/queryThirtyDayCoverTrend";
    $.ajax({
        url:url,
        type:"post",
        success:function(data){
            var overview =JSON.parse(data);
            var xdata=[];
            var ydata1=[];
            overview=overview.list;
            for(var i=0;i<overview.length;i++){

                xdata.push(overview[i].DAYS);
                ydata1.push(overview[i].FGL);
            }

            option = {
                backgroundColor: '#282c2d',//背景色
                title: {
                    text: '30天覆盖趋势'
                },
                tooltip : {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'cross',
                        label: {
                            backgroundColor: '#6a7985'
                        }
                    }
                },
                grid: {
                    left: '3%',
                    right: '4%',
                    bottom: '3%',
                    containLabel: true
                },
                xAxis : [
                    {
                        type : 'category',
                        boundaryGap : false,
                        axisLabel: {
                            show: true,
                            interval:0,
                            rotate:-30,
                            textStyle: {
                                color: '#fff'
                            }
                        },
                        data : xdata
                    }
                ],
                yAxis : [
                    {
                        type : 'value'
                    }
                ],
                series : [
                    {
                        name:'覆盖率',
                        type:'line',
                        stack: '总量',
                        areaStyle: {normal: {}},
                        data:ydata1
                    }
                ]
            };

            center_echart.setOption(option);
        },error:function(textStatus){
            console.log("error:"+textStatus.status);
        }
    });

}

function taskGroupPollingOverview(){

    url = ctx + "/InspectReport/taskGroupPollingOverview";
    $.ajax({
        url: url,
        type: "post",
        success: function (data) {

            var overview = JSON.parse(data);
            console.log(overview);
            var allNum=overview.allNum;
            var list=overview.tableData;
            var tableStr="";
            $("#xjrw").html(allNum[0].ALL_COUNT);
            $("#rwcg").html(allNum[0].SUCCESS_COUNT);
            $("#rwsb").html(allNum[0].FAIL_COUNT);
            if (list.length > 0) {
                for (var i = 0; i < 8; i++) {
                    tableStr += "<tr><td title='"+list[i].GROUP_NAME+"'><span>" + list[i].GROUP_NAME + "</span></td>";
                    tableStr += "<td><span>" + list[i].ALL_COUNT + "</span></td>";
                    tableStr += "<td><span>" + list[i].EXECUTE_COUNT + "</span></td>";
                    tableStr += "<td><span>" + list[i].FAIL_COUNT + "</span></td></tr>";
                }

            }

            $("#tb10").append(tableStr);


        }, error: function (textStatus) {
            console.log("error:" + textStatus.status);
        }
    });

}
function queryInspectOverviews(){
    url = ctx + "/KpiOverview/queryInspectOverview";
    $.ajax({
        url: url,
        type: "post",
        success: function (data) {

            var overview = JSON.parse(data);
            var overview=overview.tableData;
            var xdata = [];
            var y1data = [];
            var y2data = [];
            var y3data = [];
            var y4data = [];
            for (var i = 0; i < overview.length; i++) {
                xdata.push(overview[i].GROUP_NAME);
                y1data.push(overview[i].SUCCESS_COUNT);
                y2data.push(overview[i].FAIL_COUNT);
                y3data.push(overview[i].EXECUTE_COUNT);
                y4data.push(overview[i].P);
            }

            option = {
                backgroundColor: '#fff',//背景色
                tooltip: {
                    trigger: 'axis',
                    axisPointer : {
                        type : 'shadow'
                    },
                    formatter: function (params) {
                        return params[0].name + '<br/>'
                            + '成功:' + params[0].value + '<br/>'
                            + '失败:' + params[1].value + '<br/>'
                            + '执行中:' + params[2].value + '<br/>'
                            + '成功率:' + parseFloat((params[3].value).toPrecision(12)) + '%';
                    }
                },
                /*title: {
                    text: '任务分组成功率',
                    x: 'center',
                    textStyle: {
                        color: '#AAAAAA'
                    }
                },*/
                toolbox: {
                    show: false,
                },
                grid: {
                    x: '10%',
                    y: '20%',
                    x2: '10%',
                    y2: '20%',
                    borderWidth: 0,
                },
                calculable: true,
                legend: {
                    top:'15',
                    data: ['成功', '失败', '执行中', '成功率'],
                    top:30,
                    /*x: 'center',
                    y: 'bottom',*/
                    textStyle: {
                        color: '#AAAAAA'
                    }
                },
                xAxis: [
                    {
                        type: 'category',
                        splitLine: {
                            show: false,
                        },
                        axisLabel: {
                            show: true,
                            interval: 0,
                            rotate: -30,
                            textStyle: {
                                color: '#AAAAAA'
                            }
                        },
                        data: xdata
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        splitLine: {
                            show: true,
                        },
                        name: '',
                        axisLabel: {
                            formatter: '{value} ',
                            textStyle: {
                                color: '#AAAAAA'
                            }
                        }
                    },

                    {
                        type: 'value',
                        splitLine: {
                            show: false,
                        },
                        name: '',
                        axisLabel: {
                            formatter: '{value}%',
                            textStyle: {
                                color: '#AAAAAA'
                            }
                        }
                    }
                ],
                series: [


                    {
                        name: '成功',
                        type: 'bar',
                        stack: '总量',
                        label: {
                            normal: {
                                show: false,
                                position: 'insideRight'
                            }
                        },
                        data: y1data
                    },
                    {
                        name: '失败',
                        type: 'bar',
                        stack: '总量',
                        label: {
                            normal: {
                                show: false,
                                position: 'insideRight'
                            }
                        },
                        data: y2data
                    },
                    {
                        name: '执行中',
                        type: 'bar',
                        stack: '总量',
                        label: {
                            normal: {
                                show: false,
                                position: 'insideRight'
                            }
                        },
                        data: y3data
                    },
                    {
                        name: '成功率',
                        type: 'line',
                        yAxisIndex: 1,
                        data: y4data
                    }
                ]
            };


            down_right_echart.setOption(option);

        }, error: function (textStatus) {
            console.log("error:" + textStatus.status);
        }
    });

}
function queryTaskGroupHealth(){
    url = ctx + "/InspectReport/queryTaskGroupHealth";
    $.ajax({
        url: url,
        type: "post",
        success: function (data) {
            var overview = JSON.parse(data);
            var list=overview.list;
            /*var tableStr="";*/
            if (list.length > 0) {
                /*var gauge_id = [];
                var line_id  = [];*/
                for (var i = 0; i < list.length; i++) {
                    /*gauge_id.push("gauge"+i);
                    line_id.push("line"+i);*/
                    var gauge_id="gauge"+i;
                    var line_id="line"+i;
                    var gauge_val=list[i].HEALTH;
                    var line_val=list[i].THIRTY_DAY;
                    var tableStr="";
                    tableStr += "<tr><td title='"+list[i].GROUP_NAME+"'>" + list[i].GROUP_NAME + "</td>";
                    tableStr += "<td><div id='"+gauge_id+"' style='width: 100%;height: 300px;'></div></td>";
                    tableStr += "<td><div id='"+line_id+"' style='width: 100%;height: 300px;'></div></td></tr>";
                    $("#task_group_health").append(tableStr);
                    createTodayHealth(gauge_id,gauge_val);
                    createThirtyDayHealth(line_id,line_val);
                }
            }
            /*$("#task_group_health").append(tableStr);*/
        }, error: function (textStatus) {
            console.log("error:" + textStatus.status);
        }
    });
}

function createTodayHealth(id,val){
    dev_obj = ECharts.init(document.getElementById(id), 'dark');
    var data=[];
    data.push({name: "健康度", value: val});
    option = {
        backgroundColor: '#fff',
        tooltip: {
            formatter: "{b}:{c}%"
        },
        series: [
            {
                type: 'gauge',
                radius: '70%',
                center : ['50%', '50%'],
                axisLine: {            // 坐标轴线
                    lineStyle: {       // 属性lineStyle控制线条样式
                        color: [[0.6, '#ff4500'], [0.8, '#1e90ff'], [1, 'lime']],
                        width: 2,
                        shadowColor: '#fff', //默认透明
                        shadowBlur: 10
                    }
                },
                axisLabel: {            // 坐标轴小标记
                    textStyle: {       // 属性lineStyle控制线条样式
                        fontWeight: 'bolder',
                        fontSize:12,
                        color: '#050505',
                        shadowColor: '#fff', //默认透明
                        shadowBlur: 10
                    }
                },
                axisTick: {            // 坐标轴小标记
                    length: 12,        // 属性length控制线长
                    lineStyle: {       // 属性lineStyle控制线条样式
                        color: 'auto',
                        shadowColor: '#fff', //默认透明
                        shadowBlur: 10
                    }
                },
                splitLine: {           // 分隔线
                    length: 20,         // 属性length控制线长
                    lineStyle: {       // 属性lineStyle（详见lineStyle）控制线条样式
                        width: 3,
                        color: 'auto',
                        shadowColor: '#fff', //默认透明
                        shadowBlur: 10
                    }
                },
                pointer: {           // 分隔线
                    shadowColor: '#fff', //默认透明
                    shadowBlur: 5
                },
                title: {
                    offsetCenter: [0, -34,'50%'],
                    textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
                        fontWeight: 'bolder',
                        fontSize: 18,
                        color: '#050505',
                        shadowColor: '#fff', //默认透明
                        shadowBlur: 10
                    }
                },
                detail: {
                    formatter: '{value}',
                    backgroundColor: 'rgba(30,144,255,0.8)',
                    borderWidth: 1,
                    borderColor: '#666',
                    shadowColor : '#666', //默认透明
                    shadowBlur: 5,
                    offsetCenter: [0,'60%'],
                    textStyle: {
                        fontSize: 24,
                        color: '#fff'
                    }
                },

                data: data
            }
        ]
    };
    dev_obj.setOption(option);
}

function createThirtyDayHealth(id,val){
    dev_obj1 = ECharts.init(document.getElementById(id), 'dark');
    var xdata=[];
    var ydata1=[];
    var overview=val;
    for(var i=0;i<overview.length;i++){
        xdata.push(overview[i].DAYS);
        ydata1.push(overview[i].HEALTH);
    }
    option = {
        backgroundColor: '#fff',//背景色
        tooltip : {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                label: {
                    backgroundColor: '#6a7985'
                }
            }
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '5%',
            containLabel: true
        },
        xAxis : [
            {
                type : 'category',
                boundaryGap : false,
                axisLabel: {
                    show: true,
                    interval:1,
                    rotate:-30,
                    textStyle: {
                        color: '#AAAAAA'
                    }
                },
                data : xdata
            }
        ],
        yAxis : [
            {
                type : 'value',
                axisLabel: {
                    textStyle: {
                        color: '#AAAAAA'
                    }
                }
            }
        ],
        series : [
            {
                name:'健康度',
                type:'line',
                /*stack: '总量',*/
                /*areaStyle: {normal: {}},*/
                data:ydata1
            }
        ]
    };
    dev_obj1.setOption(option);
}